/* 
自定义hook函数
收集点击页面的坐标
*/
import {
  ref,
  onMounted,
  onBeforeUnmount
} from "vue"

export default function useClickPosition() {
  const x = ref(-1)
  const y = ref(-1)


  const handleClick = (event: MouseEvent) => {
    console.log('click...')
    x.value = event.pageX
    y.value = event.pageY
  }

  // 在mounted中绑定监听
  onMounted(() => {
    document.addEventListener('click', handleClick)
  })
  // 在死亡前解绑监听
  onBeforeUnmount(() => {
    document.removeEventListener('click', handleClick)
  })

  return {
    x,
    y
  }
}